<template>
  <a-card :bordered="false" class="card-area">
    <div class="table-page-search-wrapper"  v-if="!detailVisible">
      <a-form layout="vertical">
        <a-row :gutter="48">
          <a-col :md="6" :sm="12">
            <a-form-item label="学号">
              <a-input v-model="queryParam.xht"/>
            </a-form-item>
          </a-col>
          <a-col :md="6" :sm="12">
            <a-form-item label="姓名">
              <a-input v-model="queryParam.xm"/>
            </a-form-item>
          </a-col>
          <template v-if="advanced">
            <a-col :md="6" :sm="12">
              <a-form-item label="院系">
                <a-select :disabled="selectMenu.yx.length===1" allowClear v-model="queryParam.ssyxm" @change="yxChange" showSearch :filterOption="filterOption">
                  <a-select-option v-for="i in selectMenu.yx" :key="i.id" :value="i.dwh">{{ i.dwh }} {{ i.dwmc }}</a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :md="6" :sm="12">
              <a-form-item label="专业">
                <a-select allowClear v-model="queryParam.sszym" showSearch :filterOption="filterOption">
                  <a-select-option v-for="i in selectMenu.zy" :key="i.id" :value="i.zyh">{{ i.zyh}} {{ i.zymc }}</a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :md="6" :sm="12">
              <a-form-item label="年级">
                <a-select allowClear v-model="queryParam.sznj">
                  <a-select-option v-for="i in TYPE0126" :key="i.id" :value="i.code">{{ i.name }}</a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :md="6" :sm="12">
              <a-form-item label="学生类别">
                <a-select allowClear v-model="queryParam.xslbm">
                  <a-select-option v-for="i in TYPE0075" :key="i.id" :value="i.code">{{ i.name }}</a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :md="6" :sm="12">
              <a-form-item label="审核状态">
                <a-select allowClear v-model="shzt">
                  <a-select-option value="11">综合办审核未审核</a-select-option>
                  <a-select-option value="07">综合办审核已通过</a-select-option>
                  <a-select-option value="08">综合办审核未通过</a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :md="6" :sm="12">
              <a-form-item label="项目名称">
                <a-input v-model="queryParam.xmmc"/>
                <!-- <a-select allowClear v-model="queryParam.xmmc">
                  <a-select-option v-for="i in TYPE0075" :key="i.id" :value="i.code">{{ i.name }}</a-select-option>
                </a-select> -->
              </a-form-item>
            </a-col>
          </template>
          <a-col :md="10" :sm="20">
            <span class="table-page-search-submitButtons" >
              <a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
              <!-- <a-button type="primary" @click="batchCheck">批量审核</a-button> -->
              <a-button style="margin-left: 8px" type="primary" @click="exportByZhb">导出</a-button>
              <!-- <a-button @click="exportGjhxxmd" type="primary">导出国际学生名单</a-button> -->
              <a-button style="margin-left: 8px" @click="() =>  queryParam = {ssyxm: selectMenu.yx.length === 1 ? queryParam.ssyxm : ''}">重置</a-button>
              <a @click="advanced = !advanced" style="margin-left: 8px">
                {{ advanced ? '收起' : '展开' }}
                <a-icon :type="advanced ? 'up' : 'down'"/>
              </a>
            </span>
          </a-col>
        </a-row>
      </a-form>
      <s-table
        ref="table"
        size="default"
        rowKey="id"
        :columns="columns"
        :data="loadData"
        :alert="options.alert"
        :rowSelection="options.rowSelection"
        :pageSize="pageSize"
        :scroll="{x: 1200}"
      >
        <span slot="serial" slot-scope="text, record, index">
          {{ index + 1 }}
        </span>
       <template slot="operation" slot-scope="a,b">
          <!-- <a @click="detailRequest(b)" v-if="b.shyjszt !== '03' ">详情</a> -->
          <a @click="showEdit(b)" v-if="b.yjsyzhbshzt == '院系审核已通过'">审核</a>
          <a @click="showDetail(b)" v-else>查看详情</a><br>
          <a @click="exportPdf(b)">导出</a><br>
          <a @click="handleReport(b)" v-if="b.yjsyzhbshzt === '综合办已通过' ">退回</a>
       </template>

      </s-table>
    </div>

    <ws-check-modal ref="checkModal" title="综合办审核" :type='type' :visible="visible" @cancel="visible = false" @refresh="$refs.table.refresh(false)"/>
  </a-card>
</template>

<script>
  // import moment from 'moment'
  import {STable} from '~'
  import {mapState} from 'vuex'
  import wsCheckModal from './shyjsCheckModal'

  export default {
  name: 'TableList',
  components: {
    STable,
    wsCheckModal
  },
  data () {
    return {
      // 高级搜索 展开/关闭
      advanced: true,
      // 查询参数
      queryParam: {},
      type:"yjsy",
      shzt:"",
      // 表头
      columns: [
        {
          title: '序号',
          scopedSlots: { customRender: 'serial' }
        },
        {
          title: '学号',
          dataIndex: 'xsxx.xh'
        },
        {
          title: '姓名',
          dataIndex: 'xsxx.xm'
        },
        {
          title: '年级',
          dataIndex: 'xsxx.xjxx.sznj'
        },
        {
          title: '院系',
          dataIndex: 'xsxx.xjxx.ssyxmc'
        },
        {
          title: '专业',
          dataIndex: 'xsxx.xjxx.sszymc'
        },
        {
          title: '导师',
          dataIndex: 'xsxx.xjxx.dsxm'
        },
        {
          title: '项目名称',
          dataIndex: 'projectName'
        },
        {
          title: '审核状态',
          dataIndex: 'yjsyzhbshzt'
        },
        {
          title: '操作',
          scopedSlots: { customRender: 'operation' },
          width:100,
          fixed:'right'
        }
      ],
      pageSize: 10,
      // 加载数据方法 必须为 Promise 对象
      loadData: parameter => {
        if (this.pageSize !== 10) {
          parameter.pageSize = this.pageSize
        } else {
          this.pageSize = parameter.pageSize
        }
        parameter.pageNum = parameter.pageNo
        let params = Object.assign(this.queryParam, parameter)
        if (this.shzt == '05' || this.shzt == '06') {
          delete params.yjsyzhbshzt
          params.yxshzt = this.shzt
        } else if (this.shzt == '07' || this.shzt == '08' || this.shzt == '11') {
          console.log(this.shzt)
          delete params.yxshzt
          params.yjsyzhbshzt = this.shzt
        } else {
          delete params.yxshzt
          delete params.yjsyzhbshzt
        }
        return this.$api.student.projectZhbList(params).then(res => {
            res.data.rows.map(item => {
              if(!item.yjsyzhbshzt){
              item.yjsyzhbshzt = '院系审核已通过'
            }else{
              if(item.yjsyzhbshzt == '07'){
                item.yjsyzhbshzt = '综合办已通过'
              }else{
                item.yjsyzhbshzt = '综合办未通过'
              }
            }
          })
          return {
            data: res.data.rows,
            pageNo: parameter.pageNo,
            pageSize: parameter.pageSize,
            totalPage: Math.ceil(res.data.total / parameter.pageSize),
            totalCount: res.data.total
          }
        })
      },
      selectedRowKeys: [],
      selectedRows: [],
      options: {
        alert: { show: true, clear: () => { this.selectedRowKeys = [] } },
        rowSelection: {
          selectedRowKeys: this.selectedRowKeys,
          onChange: this.onSelectChange
        }
      },
      visible: false,
      detailVisible: false,
      baseInfo:[],
      selectMenu: {
        yx: [],
        zy: []
      }
    }
  },
  computed: {
    ...mapState({
      TYPE0125: state => state.app['TYPE0125'],
      TYPE0075: state => state.app['TYPE0075'],
      TYPE0503: state => state.app['TYPE0503'],
      TYPE0126: state => state.app['TYPE0126'],
      TYPE0455: state => state.app['TYPE0455'],
    })
  },
  beforeCreate () {
    this.form = this.$form.createForm(this)
  },
  created () {
    this.initSelectMenu()
    this.$store.dispatch('app/setDictionary', 'TYPE0075')
    this.$store.dispatch('app/setDictionary', 'TYPE0126')
    this.$store.dispatch('app/setDictionary', 'TYPE0125')
    this.$store.dispatch('app/setDictionary', 'TYPE0503')
    this.$store.dispatch('app/setDictionary', 'TYPE0455')
    // this.$set(this.queryParam, 'shyjszt', '03')
    this.$store.dispatch('app/sysInfo').then(data => {
      // this.$set(this.queryParam, 'xn', data.schoolYear)
      this.$nextTick(() => {
        this.$refs.table.refresh()
      })
    })
  },
  methods: {
    initSelectMenu () {
      let allRequest = [
        this.$api.base.collegeAll()
      ]
      Promise.all(allRequest).then(res => {
        this.selectMenu = {
          yx: res[0].data
        }
        if(this.selectMenu.yx && this.selectMenu.yx.length == 1){
          this.$set(this.queryParam, 'ssyxm', this.selectMenu.yx[0].dwh)
          this.yxChange(this.queryParam.ssyxm)
        }
        this.$nextTick(() => {
          this.$refs.table.refresh(true)
        })
      })
    },
    filterOption (value, op) {
      return op.componentOptions.children[0].text.indexOf(value) !== -1
    },
    onSelectChange (selectedRowKeys, selectedRows) {
      this.selectedRowKeys = selectedRowKeys
      this.selectedRows = selectedRows
    },
    yxChange (code) {
      this.$set(this.queryParam, 'sszym', '')
      this.$api.base.majorAll({lsdwh: code}).then(res => {
        this.$set(this.selectMenu, 'zy', res.data)
      })
    },
    showEdit(row) {
      this.visible = true
     this.$refs.checkModal.show = ''
      this.$api.student.projectId(row.id).then(res => {
         this.$refs.checkModal.info = res.data
      })
      this.$refs.checkModal.form.resetFields()
    },
    showDetail(row){
      this.visible = true
      this.$refs.checkModal.show = 'detail'
      this.$api.student.projectId(row.id).then(res => {
         this.$refs.checkModal.info = res.data
      })
    },
    batchCheck() {
      if (!this.selectedRowKeys.length) {
        this.$message.warning('请选择需要审核的学生')
        return
      }
      this.visible = true
      this.$refs.checkModal.isBatchCheck = true
      this.$refs.checkModal.info.id = this.selectedRowKeys.join(',')
      this.$refs.checkModal.form.resetFields()
    },
    detailRequest (row) {
    	this.detailVisible = true;
    	var id = null;
    	if(row) {
    		id = row.id;
    	}
    	this.$api.student.getShyjsBaseInfo(id).then(res => {
    		 this.baseInfo = res.data
        this.form.setFieldsValue(this.baseInfo)
      })
    },
    exportPdf(row) {
      this.$export('/admissions/gjhxmsb/gjhxmsb/export?id=' + row.id)
    },
    exportGjhxxmd() {
      let params = {...this.queryParam}
      this.$export('/admissions/gjhxmsb/gjhxmsb/exportGjhxxmd', params)
    },
    exportByZhb() {
      let params = {...this.queryParam}
      this.$export('/admissions/gjhxmsb/gjhxmsb/exportByZhb', params)
    },
    handleReport(row) {
      var that = this;
      this.$confirm({
        title: '确定退回?',
        onOk() {
          var user = that.$db.get('USER')
          let params = {yxshyy: '06', id: row.id, yjsyzhbsh: user.qmzd}
          that.$api.student.graduateth(params).then(res => {
            that.$message.success('退回成功')
            that.$refs.table.refresh()
          })
          },
          onCancel() {

          },
          class: 'test',
        });
      },
  }
}
</script>
